<script setup lang="ts" name="Playground">
// import { h, render } from 'vue'
// import XtxMessage from '@/components/message/message.vue'
import Message from '@/components/message/index'

// const show = () => {
//   // 动态创建消息提示组件, 插入页面
//   const vNode = h(
//     XtxMessage,
//     {
//       type: 'warning',
//     },
//     '哈哈哈'
//   )

//   render(vNode, document.querySelector('.box')!)
// }

const clickFn = () => {
  // Message({
  //   type: 'success',
  //   text: '登录成功',
  // })
  // 函数是个复杂类型, 对象
  // Message.success('登录成功', 4000)
  Message.error('登录失败')
}
</script>

<template>
  <!-- 专门用于测试不稳定的代码 -->
  <div>演练场</div>
  <button @click="clickFn">登录</button>
  <!-- <div class="box"></div> -->
  <!-- <XtxMessage type="warning">哈哈哈</XtxMessage> -->
</template>

<style scoped></style>
